<!DOCTYPE html>
<html>
    <!--头文件-->
    {include file='head'}

<section class="rt_wrap content mCustomScrollbar">
    <div class="rt_content">
        <div class="page_title">
            <h2 class="fl">添加商品</h2>
            <a class="fr top_rt_btn">返回产品列表</a>
        </div>
        <section>
            <ul class="ulColumn2">

                <li>
                    <!--上传图片-->
                    <form action="upload" method="post" enctype="multipart/form-data">
                    <span class="item_name" style="width:120px;">上传图片：</span>

                        <label class="uploadImg">
                            <input type="file" name="img"/>
                            <span>上传图片</span>
                        </label>

                        <span class="item_name" style="width:40px;"></span>
                        <input type="submit" value="上传" class="link_btn"/>
                    </form>
                </li>

                <li>
                    <span class="item_name" style="width:120px;">商品名称：</span>
                    <input type="text" class="textbox textbox_295" placeholder="商品名称..." name="shopName" maxlength="30"/>
                    <span class="tips"></span>
                </li>
                <li>
                    <span class="item_name" style="width:120px;">商品货号：</span>
                    <input type="text" class="textbox" placeholder="商品货号..."  name="shopCard" maxlength="8"/>
                    <span class="tips"></span>
                </li>
                <li>
                    <span class="item_name" style="width:120px;">品牌：</span>
                    <select class="select" id="sel1">
                        <option value="0">选择产品品牌</option>
                        {foreach $brand as $b}
                        <option value="{$b['brand_id']}">{$b['brand_name']}</option>
                        {/foreach}
                    </select>
                    <span class="tips"></span>
                </li>
                <li>
                    <span class="item_name" style="width:120px;">分类：</span>
                    <select class="select" id="sel2">
                        <option value="0">选择产品分类</option>
                        {foreach $type as $t}
                        <option value="{$t['type_id']}">{$t['type_name']}</option>
                        {/foreach}
                    </select>
                    <span class="tips"></span>
                </li>
                <li>
                    <span class="item_name" style="width:120px;">属性：</span>
                    <select class="select" id="sel3">
                        <option value="0">选择产品属性</option>
                        {foreach $attr as $a}
                        <option value="{$a['attr_id']}">{$a['attr_name']}</option>
                        {/foreach}
                    </select>
                    <span class="tips"></span>
                </li>
                <li>
                    <span class="item_name" style="width:120px;">重量：</span>
                    <input type="text" class="textbox" placeholder="重量..."  name="weight" maxlength="8"/>
                    <select class="select" id="sel4">
                        <option value="0">重量单位</option>
                        <option value="1">克</option>
                        <option value="2">千克</option>
                    </select>
                    <span class="tips"></span>&nbsp;
                    <span class="tips"></span>
                </li>
                <li>
                    <span class="item_name" style="width:120px;">本店售价：</span>
                    <input type="text" class="textbox" placeholder="本店售价..."  name="shopPrice" maxlength="8"/>
                    <span>元</span>&nbsp;&nbsp;&nbsp;
                    <span class="tips"></span>
                </li>
                <li>
                    <span class="item_name" style="width:120px;">市场售价：</span>
                    <input type="text" class="textbox" placeholder="市场售价..."  name="marketPrice" maxlength="8"/>
                    <span>元</span>&nbsp;&nbsp;&nbsp;
                    <span class="tips"></span>
                </li>
                <li>
                    <span class="item_name" style="width:120px;">库存量：</span>
                    <input type="text" class="textbox" placeholder="库存数量..."  name="stockNum" maxlength="8"/>
                    <span>件</span>&nbsp;&nbsp;&nbsp;
                    <span class="tips"></span>
                </li>

                <li>
                    <span class="item_name" style="width:120px;">状态：</span>
                    <label class="single_selection"><input type="radio" name="onSale" checked/>上架</label>
                    <label class="single_selection"><input type="radio" name="onSale"/>下架</label>
                    &nbsp;&nbsp;&nbsp;<span class="tips"></span>
                </li>
                <li>
                    <span class="item_name" style="width:120px;">推荐：</span>
                    <label class="single_selection"><input type="checkbox" class="flag"/>新品</label>
                    <label class="single_selection"><input type="checkbox" class="flag"/>精品</label>
                    <label class="single_selection"><input type="checkbox" class="flag"/>热销</label>
                    &nbsp;&nbsp;&nbsp;<span class="tips"></span>
                </li>

                <!--文本框-->
                <li>
                    <span class="item_name" style="width:120px;">产品详情：</span>
                    <textarea class="textbox" name="text" rows="16" cols="80" style="height:200px; resize: none;"></textarea>

                </li>

                <li>
                    <span class="item_name" style="width:120px;"></span>
                    <input type="submit" class="link_btn" name="btn">
                </li>
            </ul>
        </section>
    </div>
</section>
</body>
</html>
<script>
        //添加数据
        $(function () {

            //变量
            var $oName = null;  //商品名
            var $oCard = null;  //商品编号
            var $oBrand = null; //品牌id
            var $oType = null;  //分类id
            var $oAttr = null;  //属性id
            var $oWeight = null;//重量
            var $oUnit = null;  //重量单位
            var $oPrice = null; //本店价
            var $oMarket = null;//市场价
            var $oStock = null; //库存
            var $oSale = 'yes';  //是否上架
            var $oState = ''; //状态
            var $oDesc = '';  //描述

            //标记位
            var fName = false;
            var fCard = false;
            var fType = false;
            var fAttr = false;
            var fBrand = false;
            var fWeight = false;
            var fUnit = false;
            var fPrice = false;
            var fMarket = false;
            var fStock = false;
            var fState = false;
            var fDesc = false;


            //商品名
            $('[name=shopName]').blur(function () {

                //取值, 动用正则,排除输入空字符符号
                $oName = $('[name=shopName]').val().replace(/(^\s*)|(\s*$)/g, "");

                //商品名是否为空
                if ($oName.length == 0) {
                    $('.tips').eq(0).addClass('errorTips').html('商品名不得为空').css('color', 'red');
                    fName = false;
                    return false;
                }

                //利用正则判断汉字
                if ($oName.match(/^[\u4E00-\u9FA5]{1,}$/)) {
                    //alert('这是汉字');
                    if ($oName.length > 10 || $oName.length < 1) {
                        $('.tips').eq(0).addClass('errorTips').html('商品名应为 1~10 个汉字').css('color', 'red');
                        fName = false;
                        return false;
                    }

                } else {
                    //alert('这不是汉字');
                    if ($oName.length > 30 || $oName.length < 3) {
                        $('.tips').eq(0).addClass('errorTips').html('商品名应为 3~30 位字符串').css('color', 'red');
                        fName = false;
                        return false;
                    }
                }
                fName = true;
                //console.log(fName);
                $('.tips').eq(0).addClass('errorTips').html('合法').css('color', 'green');

            });

            //商品编号
            $('[name=shopCard]').blur(function () {

                //获取用户名的值, 动用正则,排除输入空字符符号
                $oCard = $('[name=shopCard]').val().replace(/(^\s*)|(\s*$)/g, "");

                //判断用户名是否为空
                if ($oCard.length == 0) {
                    $('.tips').eq(1).addClass('errorTips').html('商品编号不得为空').css('color', 'red');
                    fCard = false;
                    return false;
                }

                //console.log($oCard.match( /^[0-9a-zA-Z]*$/g));  //正则匹配返回数组
                //编号只能为数字,字母,或二者组合
                if ($oCard.length != 8 || !$oCard.match( /^[0-9a-zA-Z]*$/g)) {

                    $('.tips').eq(1).addClass('errorTips').html('编号只能为8  位数字,字母或二者组合').css('color', 'red');
                    fCard = false;
                    return false;
                }

                fCard = true;
                if (fCard) {
console.log($oCard);
                    //ajax传输
                    $.post('card', {card: $oCard}, success, 'json');
                }

            });

            //品牌
            $('#sel1').change(function () {

                //取值
                $oBrand = $('#sel1').val();
                //console.log($oBrand);

                //是否添加选项
                if ($oBrand > 0) {

                    $('.tips').eq(2).addClass('errorTips').html('品牌合法').css('color', 'green');
                    fBrand = true;
                } else {
                    fBrand = false;
                }
            });

            //分类
            $('#sel2').change(function () {

                $oType = $('#sel2').val();
                //console.log($oType);
                //是否添加选项
                if ($oType > 0) {

                    $('.tips').eq(3).addClass('errorTips').html('分类名合法').css('color', 'green');
                    fType = true;
                } else {
                    fType = false;
                }
            });

            //属性
            $('#sel3').change(function () {

                $oAttr = $('#sel3').val();
                //console.log($oAttr);
                if ($oAttr > 0) {

                    $('.tips').eq(4).addClass('errorTips').html('属性名合法').css('color', 'green');
                    fAttr = true;
                } else {
                    fAttr = false;
                }
            });

            //重量
            $('[name=weight]').blur(function () {

                $oWeight = $(this).val().replace(/(^\s*)|(\s*$)/g, "");

                //是否为空,长度0~8位, 只能为数字,包括小数,大于0
                if ($oWeight.length == 0 || $oWeight.length > 8 || isNaN($oWeight) || $oWeight <= 0) {
                    $('.tips').eq(5).addClass('errorTips').html('重量只能为1~8位,大于0 的纯数字').css('color', 'red');
                    fWeight = false;
                    return false;
                } else {
                    fWeight = true;
                    $('.tips').eq(5).addClass('errorTips').html('重量合法').css('color', 'green');
                }
            });

            //重量单位
            $('#sel4').change(function () {

                $oUnit = '';
                $oUnit = $('#sel4').val();
                //console.log($oUnit);
                if ($oUnit > 0) {

                    $('.tips').eq(6).html('单位名合法').css('color', 'green');
                    fUnit = true;
                } else {
                    fUnit = false;
                }

            });

            //本店售价
            $('[name=shopPrice]').blur(function () {

                $oPrice = $(this).val().replace(/(^\s*)|(\s*$)/g, "");

                //是否为空,长度0~8位, 只能为数字,包括小数,大于0
                if ($oPrice.length == 0 || $oPrice.length > 8 || isNaN($oPrice) || $oPrice <= 0) {
                    $('.tips').eq(7).addClass('errorTips').html('本店售价只能为1~8位,大于0 的纯数字').css('color', 'red');
                    fPrice = false;
                    return false;
                }

                fPrice = true;
                $('.tips').eq(7).addClass('errorTips').html('本店售价合法').css('color', 'green');
            });

            //市场价
            $('[name=marketPrice]').blur(function () {

                $oMarket = $(this).val().replace(/(^\s*)|(\s*$)/g, "");
                //console.log($oMarket);

                //是否为空,长度0~8位, 只能为数字,包括小数,大于0
                if ($oMarket.length == 0 || $oMarket.length > 8 || isNaN($oMarket) || $oMarket <= 0) {
                    $('.tips').eq(8).addClass('errorTips').html('市场价只能为1~8位,大于0 的纯数字').css('color', 'red');
                    fMarket = false;
                    return false;
                }

                fMarket = true;
                $('.tips').eq(8).addClass('errorTips').html('市场价合法').css('color', 'green');

            });

            //库存量
            $('[name=stockNum]').blur(function () {

                $oStock = $(this).val().replace(/(^\s*)|(\s*$)/g, "");
                //console.log($oStock);

                //是否为空,长度0~8位, 只能为数字,包括小数,大于0
                if ($oStock.length == 0 || $oStock.length > 8 || isNaN($oStock) || $oStock < 0) {
                    $('.tips').eq(9).addClass('errorTips').html('库存量只能为1~8位,大于0 的纯数字').css('color', 'red');
                    fStock = false;
                    return false;
                }

                fStock = true;
                $('.tips').eq(9).addClass('errorTips').html('库存量合法').css('color', 'green');

            });

            /*********************   此处继续   **************************/
            //是否上架
            $('[name=onSale]').click(function () {

                var $oSale1 = $('[name=onSale]').eq(0)[0].checked;  //上架
                //var $oSale2 = $('[name=onSale]').eq(1)[0].checked;  //下架
                //console.log($oSale1);

                $oSale = '';
                if ($oSale1) {

                    $oSale = 'yes';
                } else {
                    $oSale = 'no';
                }
                //console.log($oSale);
            });
            //推荐
            $('.flag').change(function () {

                //初始化
                $oState = '';
                var $oNew = $('.flag').eq(0)[0].checked;    //新品
                var $oElite = $('.flag').eq(1)[0].checked;  //精品
                var $oHot = $('.flag').eq(2)[0].checked;    //热销
                //console.log($oNew);

                //console.log($oState);
                //若checked 为 true,那个状态存在就拼接那个状态
                if ($oNew) {
                    $oState += 'new_';
                }
                if ($oElite) {
                    $oState += 'elite_';
                }
                if ($oHot) {
                    $oState += 'hot_';
                }
                //拼接好的字符串
                //console.log($oState);

            });

            //商品描述
            $('[name=text]').blur(function () {

                $oDesc = $(this).val().replace(/(^\s*)|(\s*$)/g, "");
                //console.log($oDesc);

                //是否为汉字
                if ($oDesc.match(/^[\u4E00-\u9FA5]{1,}$/)) {

                    //80个汉字之内
                    if ($oDesc.length > 80) {

                        $('.tips').eq(12).addClass('errorTips').html('不得超过80个汉字').css('color', 'red');
                        fDesc = false;
                        return false;
                    }
                } else {

                    //240个字符之内
                    if ($oDesc.length > 240) {

                        $('.tips').eq(12).addClass('errorTips').html('字数不得超过200个字符').css('color', 'red');
                        fDesc = false;
                        return false;
                    }
                }

                fDesc = true;
                $('.tips').eq(12).addClass('errorTips').html('商品描述合法').css('color', 'green');

            });

            //按钮提交
            $('[name=btn]').click(function () {

                //ajax传输
                if (fName && fCard && fWeight && fUnit && fType && fAttr && fBrand && fPrice && fMarket && fStock) {

                    //console.log();
                    //ajax
                    $.post('add',{name:$oName, card:$oCard, brand:$oBrand, type:$oType, attr:$oAttr, weight:$oWeight, unit:$oUnit, price:$oPrice, market:$oMarket, stock:$oStock, onSale:$oSale,state:$oState ,desc:$oDesc},success,'json');

                } else {
                    //商品名
                    if (!fName) {
                        $('.tips').eq(0).addClass('errorTips').html('商品名称不合法').css('color', 'red');
                    }
                    //商品编号
                    if (!fCard) {
                        $('.tips').eq(1).addClass('errorTips').html('商品编号不合法').css('color', 'red');
                    }

                    //品牌
                    if (!fBrand) {
                        $('.tips').eq(2).addClass('errorTips').html('品牌名不得为空').css('color', 'red');
                    }

                    //分类
                    if (!fType) {
                        $('.tips').eq(3).addClass('errorTips').html('分类名不得为空').css('color', 'red');
                    }

                    //属性
                    if (!fAttr) {
                        $('.tips').eq(4).addClass('errorTips').html('属性名不得为空').css('color', 'red');
                    }

                    //重量
                    if (!fWeight) {
                        $('.tips').eq(5).addClass('errorTips').html('重量不得为空').css('color', 'red');
                    }

                    //重量单位
                    if (!fUnit) {
                        $('.tips').eq(6).addClass('errorTips').html('单位选项不得为空').css('color', 'red');
                    }

                    //本店售价
                    if (!fPrice) {
                        $('.tips').eq(7).addClass('errorTips').html('本店售价不得为空').css('color', 'red');
                    }

                    //市场价
                    if (!fMarket) {
                        $('.tips').eq(8).addClass('errorTips').html('市场价不得为空').css('color', 'red');
                    }

                    //库存量
                    if (!fStock) {
                        $('.tips').eq(9).addClass('errorTips').html('库存量不得为空').css('color', 'red');
                    }

                    alert('请先按上述要求完成操作');
                    return false;
                }
            });

            function success(data)
            {
                console.log(data);

                switch (data.state) {

                    //商品编号
                    case 1:
                        $('.tips').eq(1).addClass('errorTips').html(data.tip).css('color', 'red');
                        fCard = false;
                        break;
                    //编号合法
                    case 2:
                        $('.tips').eq(1).html(data.tip).css('color', 'green');
                        break;
                    //添加成功
                    case 3:
                        alert(data.tip);
                        //重载当前页面
                        window.location.reload();
                        break;
                    //添加失败
                    case 4:
                       alert(data.tip);
                        var fName = false;
                        var fCard = false;
                        var fType = false;
                        var fAttr = false;
                        var fBrand = false;
                        var fWeight = false;
                        var fUnit = false;
                        var fPrice = false;
                        var fMarket = false;
                        var fStock = false;
                        var fState = false;
                        var fDesc = false;
                        break;
                    case 5:
                        alert(data.tip);
                        var fType = false;
                        var fAttr = false;
                        var fBrand = false;
                        break;
                }
            }
        });

</script>